import { defineStore } from "pinia";
import { computed, ref } from "vue";

export const useInfoStore = defineStore("info", {
  state: () => ({
    count: 10,
    num: 20,
    title: "info",
  }),
  getters: {
    g1: (state) => state.title + "hello",
    g2: (state) => this.g1 + state.count,
    g3: (state) => {
      return (data) => {
        return data + state.num;
      };
    },
  },

  actions: {
    log() {
      console.log("log hello shop");
    },
    say() {
      this.log();
      console.log("hello info");
    },
  },
});

export const useShopStore = defineStore("shop", () => {
  // setup
  const count = ref(200);
  const num = ref(20);
  const title = ref("shop");

  const g1 = computed(() => {
    return title.value + " hello";
  });

  const g2 = computed(() => {
    const infoStore = useInfoStore();
    return infoStore.g1 + g1;
  });
  const g3 = computed(() => {
    return (data) => {
      return data + count.value;
    };
  });

  function log() {
    console.log("log hello shop");
  }
  function say() {
    const infoStore = useInfoStore();
    infoStore.say();
    log();
    console.log("hello shop");
  }
  return {
    count,
    title,
    g1,
    say,
    num,
    g2,
    g3,
    log,
  };
});

export const useCartStore = defineStore("shop", {
  state() {
    return {
      title: "hello cart",
    };
  },
  getters: {
    g2: () => {
      const infoStore = useInfoStore();
      return infoStore.g1;
    },
  },
});
